<template>
  <!-- 选择模型 -->
  <div>
    <a-modal title="选择模型" :visible="visible" width="90%" v-bind="$attrs" :footer="null" @cancel="$emit('update:visible', false)">
      <searchData v-show="!visible.detail" :search-data="searchOptions" @search="handleSearch" />
      <b-table ref="table" row-key="id" :columns="columns" :pageKeys="['pageNum', 'pageSize', 'total']" :request="loadData" :scroll="{ y: GET_REDRESS_PERCENTAGE*0.4 + 'vh' }">
        <a slot="modelName" slot-scope="text, record" @click="$emit('handleOpen', [{id: record.id, modelId: record.modelFileId, version: record.modelFileVersion, modelTitle: record.modelName }])">{{ text }}</a>
      </b-table>
    </a-modal>
  </div>
</template>

<script>
import Selector from '@/components/Select/Selector'
import { getList } from '@/api/bimIntegrate/bimModel'
import { getPageTypesLabel } from '@/api/bimIntegrate/bimResource.js'
import { mapGetters } from 'vuex'

const searchOptions = [
  {
    name: '模型名称',
    value: 'modelName',
    type: 'input'
  },
  // {
  //   name: '模型分类',
  //   valueKey: 'modelClassifyId',
  //   type: Selector,
  //   customApi: getPageTypesLabel,
  //   customQuery: { param: { type: '38' } },
  //   dataValue: 'data.list'
  // },
  {
    name: '楼层标签',
    valueKey: 'floorLabelId',
    type: Selector,
    customApi: getPageTypesLabel,
    customQuery: { param: { type: '35' } },
    dataValue: 'data.list'
  },
  {
    name: '修改人',
    value: 'modifiedUserName',
    type: 'input'
  },
  {
    name: '专业分类',
    valueKey: 'professionalTypeId',
    type: Selector,
    customApi: getPageTypesLabel,
    customQuery: { param: { type: '34' } },
    dataValue: 'data.list'
  },
  {
    name: '模型类别',
    valueKey: 'modelTypeId',
    type: Selector,
    customApi: getPageTypesLabel,
    customQuery: { param: { type: '33' } },
    dataValue: 'data.list'
  },
  // {
  //   name: '详细程度',
  //   valueKey: 'detailDegreeId',
  //   type: Selector,
  //   customApi: getPageTypesLabel,
  //   customQuery: { param: { type: '37' } },
  //   dataValue: 'data.list'
  // },
  // {
  //   name: '模型来源',
  //   valueKey: 'modelSourceId',
  //   type: Selector,
  //   customApi: getPageTypesLabel,
  //   customQuery: { param: { type: '36' } },
  //   dataValue: 'data.list'
  // },
  {
    name: '更新时间',
    value: 'updateTime',
    type: 'dateRange',
    attr: {
      rangeFormat: ['modifiedStartTime', 'modifiedEndTime']
    }
  }
]

const columns = [
  {
    title: '序号',
    width: 60,
    dataIndex: 'index',
    customRender() {
      return arguments[2] + 1
    }
  },
  {
    title: '模型名称',
    // width: 100,
    dataIndex: 'modelName',
    scopedSlots: { customRender: 'modelName' }
  },
  // {
  //   title: '模型分类',
  //   dataIndex: 'modelClassifyName'
  // },
  {
    title: '模型类别',
    dataIndex: 'modelTypeName'
  },
  {
    title: '专业分类',
    dataIndex: 'professionalTypeName'
  },
  {
    title: '楼层标签',
    dataIndex: 'floorLabelName'
  },
  {
    title: '模型介绍',
    dataIndex: 'modelIntroduce',
    ellipsis: true
  },
  {
    title: '版本说明',
    dataIndex: 'versionExplain',
    ellipsis: true
  },
  {
    title: '模型大小',
    dataIndex: 'modelSize',
    customRender(e) {
      return e ? e + 'M' : '无'
    }
  },
  {
    title: '更新时间',
    dataIndex: 'modifiedTime'
  },
  // {
  //   title: '模型来源',
  //   dataIndex: 'modelSourceName',
  //   ellipsis: true
  // },
  // {
  //   title: '详细程度',
  //   dataIndex: 'detailDegreeName'
  // },
  {
    title: '修改人',
    dataIndex: 'modifiedUserName'
  },
  {
    title: '当前版本',
    dataIndex: 'modelVersion',
    scopedSlots: { customRender: 'modelVersion' }
  }
]

export default {
  name: 'BimView',
  props: {
    // 显隐
    visible: {
      type: Boolean,
      required: true
    },
    // 请求的额外参数
    extraParams: {
      type: Object,
      required: true
    }
  },
  data() {
    this.columns = columns
    this.searchOptions = searchOptions
    return {
      queryParams: {}, // 搜索条件参数
      init: false // 是否初始化
    }
  },
  watch: {
    visible(val) {
      if (val) {
        this.init && this.handleSearch()
      }
    }
  },
  computed:{
    ...mapGetters(['GET_REDRESS_PERCENTAGE']),
  },
  mounted() {
    this.$nextTick(() => {
      this.init = true
    })
  },
  methods: {
    /**
     * @description: 搜索
     * @param {*} val：搜索参数
     */
    handleSearch(val) {
      val && (this.queryParams = val)
      this.$refs.table?.getData(null, true)
    },
    /**
     * @description: 模型列表分页查询接口
     * @param {*} params:分页参数
     * @return {Promise}
     */
    loadData(params) {
      if (!this.extraParams?.projectId) {
        return Promise.resolve({ code: 200, total: 0, data: [] })
      }
      let args = Object.assign(params, { param: { ...this.queryParams, ...this.extraParams } })
      // return Promise.resolve({ code: 200, data: [{ name: '我是模板' }] })
      return getList(args).then((res) => {
        if (res.code === '0') {
          return { code: 200, data: res.data?.list, total: res.data?.total }
        }
      })
    }
  }
}
</script>

<style lang='less' scoped>
</style>
